<!-- 求助部分首页 -->
<template>
  <div>
    <!-- 使用导航栏来切换地区，比之前大字美观 -->
    <van-nav-bar
      title="求助"
      :right-text="helpSC"
      @click-right="show = true"
      :border="false"
      style="height: 54px"
    >
      <template #left>
        <router-link to="/postHelp">
          <van-icon name="add-o" size="25" />
        </router-link>
      </template>
    </van-nav-bar>
    <!-- ActionSheet动画面板显示切换区域 -->
    <van-action-sheet
      v-model="show"
      :actions="actions"
      @select="onSelect"
      close-on-click-action
      cancel-text="取消"
    />

    <!-- 标签页切换 -->
    <van-tabs @click="onclick" v-model="helpActive">
      <van-tab v-for="na in navigate" :title="na.content" :name="na.id">
        <!-- 占位符 -->
        <router-view />
      </van-tab>
    </van-tabs>
  </div>
</template>

<script>
import {Toast} from "vant";
import {mapState} from "vuex";
import axios from "axios";

export default {
  data() {
    return {
      // 为ActionSheet添加属性
      show: false,
      school: '本校区',
      actions: [{id: 1000, name: "本校区" }, {id: 2000, name: "全国区" }],
      navigate: [
        {id: 1001,content: "学习区"},
        {id: 1002,content: "失物招领"},
        {id: 1003,content: "校园生活"},
        {id: 1004,content: "兼职区"},
        {id: 1005,content: "校园情区"}],
      navigate_country: [
          {id: 2001,content: "学习区"},
          {id: 2002,content: "生活区"},
          {id: 2003,content: "情感区"},
      ],
      navigate_school: [
        {id: 1001,content: "学习区"},
        {id: 1002,content: "失物招领"},
        {id: 1003,content: "校园生活"},
        {id: 1004,content: "兼职区"},
        {id: 1005,content: "校园情区"}
      ]
    };
  },
  computed: {
    ...mapState(['helpActive','helpSC'])
  },
  created() {
    if(this.helpSC=="本校区"){
      this.navigate=this.navigate_school
    }else{
      this.navigate = this.navigate_country
    }
    const school = "昆明理工大学"
    console.log('------------helpActive:',this.helpActive)
    this.axios.get('http://localhost:10005/cooperation/school/'+this.helpActive+'/list/'+school).then(response =>{
      console.log("是哪个区",this.helpSC)
      if (response.data.state == 200){
        console.log("文章列表",response.data.data)
        /*this.$store.commit("updateHelpActive",this.moduleId)*/
        this.$store.commit("updateHelpArray",response.data.data)
        /*this.shareArray = response.data.data
        console.log(this.shareArray)
        this.$store.commit("updateActiveName",name)
        this.$store.commit("updateShareArray",response.data.data)*/
      }else {}
    })
  },
  methods: {
    // ActionSheet触发事件
    onSelect(item) {
        this.helpSC = item.name
      this.$store.commit("updateHelpSC",item.name)
      console.log("asdfasdfasdf",this.helpSC)
      if(this.helpSC=="本校区"){
        this.navigate=this.navigate_school
        //获取数据
        this.moduleId = 1001
        this.helpActive = 1001
        const school = "昆明理工大学"
        this.axios.get('http://localhost:10005/cooperation/school/'+this.moduleId+'/list/'+school).then(response =>{
          if (response.data.state == 200){
            console.log("文章列表",response.data.data)
            this.$store.commit("updateHelpActive",this.moduleId)
            this.$store.commit("updateHelpArray",response.data.data)
            /*this.shareArray = response.data.data
            console.log(this.shareArray)
            this.$store.commit("updateActiveName",name)
            this.$store.commit("updateShareArray",response.data.data)*/
          }else {}
        })
      }else {
        this.navigate = this.navigate_country
        //获取数据
        this.moduleId = 2001
        this.helpActive = 2001
        const school = "昆明理工大学"
        this.axios.get('http://localhost:10005/cooperation/country/'+this.moduleId+'/list').then(response =>{
          if (response.data.state == 200){
            console.log("文章列表",response.data.data)
            this.$store.commit("updateHelpSC",this.helpSC)
            this.$store.commit("updateHelpActive",this.moduleId)
            this.$store.commit("updateHelpArray",response.data.data)
            /*this.shareArray = response.data.data
            console.log(this.shareArray)
            this.$store.commit("updateActiveName",name)
            this.$store.commit("updateShareArray",response.data.data)*/
          }else {}
        })
      }
      console.log(item)
    },
    //获取求助列表
    onclick(name, title) {
      console.log("name:"+name+"title:"+title);
      if(this.helpSC=="本校区"){
        this.moduleId = name
        this.helpActive = name
        console.log(this.moduleId)
        const school = "昆明理工大学"
        this.axios.get('http://localhost:10005/cooperation/school/'+this.moduleId+'/list/'+school).then(response =>{
          if (response.data.state == 200){
            console.log("文章列表",response.data.data)
            this.$store.commit("updateHelpActive",this.moduleId)
            this.$store.commit("updateHelpArray",response.data.data)
            /*this.shareArray = response.data.data
            console.log(this.shareArray)
            this.$store.commit("updateActiveName",name)
            this.$store.commit("updateShareArray",response.data.data)*/
          }else {

          }
        })
      }else {

        this.moduleId = name
        this.helpActive = name
        console.log(this.moduleId)
        const school = "昆明理工大学"
        this.axios.get('http://localhost:10005/cooperation/country/'+this.moduleId+'/list').then(response =>{
          if (response.data.state == 200){
            console.log("文章列表",response.data.data)
            this.$store.commit("updateHelpActive",this.moduleId)
            this.$store.commit("updateHelpArray",response.data.data)
            /*this.shareArray = response.data.data
            console.log(this.shareArray)
            this.$store.commit("updateActiveName",name)
            this.$store.commit("updateShareArray",response.data.data)*/
          }else {

          }
        })
      }


    }
  },
};
</script>

<style>
</style>